<template>
    <div :class="`${PREFIX}`">
        <div :class="`${PREFIX}-title`">开启99友婚</div>
        <div :class="`${PREFIX}-block`">
            <h3 :class="`${PREFIX}-block-title`">友情婚姻</h3>
            <p :class="`${PREFIX}-block-con`">是一种特殊的婚姻形式，指的是朋友之间为了各种原因而相互结婚，在这种婚姻关系中，双方不存在恋爱情感，仅仅是为了互相照顾，解决生活上的问题而选择结婚</p>
        </div>
        <div :class="`${PREFIX}-block`">
            <h3 :class="`${PREFIX}-block-title`">相对于传统婚姻</h3>
            <p :class="`${PREFIX}-block-con`">友婚更注重互相理解、信赖和尊重，而非恋爱情感和浪漫情怀</p>
        </div>
        <div :class="`${PREFIX}-block`">
            <h3 :class="`${PREFIX}-block-title`">婚姻关系</h3>
            <p :class="`${PREFIX}-block-con`">友婚的婚姻关系是建立在朋友之间的基础上，需要双方有着相似的生活习惯、价值观和目标，以及充分的沟通和交流</p>
        </div>
        <div :class="`${PREFIX}-wrap`">
            <Download />
        </div>
    </div>
</template>
<script setup>
const PREFIX = 'home-main'
import Download from '../../components/Download.vue'
</script>
<style lang="less">
.home-main {
    width: 1400px;
    margin: 0 auto;
    box-sizing: border-box;
    padding: 107px 65px;

    &-title {
        height: 50px;
        color: #666666;
        text-align: center;
        font-size: 42px;
        line-height: 50px;
    }

    &-block {
        &-title {
            height: 34px;
            color: #666666;
            text-align: left;
            font-size: 28px;
            line-height: 34px;
        }

        &-con {
            height: 93px;
            color: #999999;
            text-align: left;
            font-size: 18px;
            line-height: 22px;
            margin-top: 16px;
        }
    }
    &-wrap {
        padding: 0 40px;
    }
}
</style>